<template>
    <div class="h-full flex flex-col gap-4 overflow-hidden">
        <ElCard class="mt-4">
            <p class="text-center font-bold text-2xl">更新日志</p>
        </ElCard>
        <ElScrollbar>
            <div class="flex flex-col gap-4">
                <ElCard v-for="item in updateLog">
                    <template #header>
                        <div class="card-header flex gap-2 items-center">
                            <p class="font-bold text-xl">{{ item.logVersion }}</p>
                            <p>{{ item.logTitle }}</p>
                        </div>
                    </template>
                    <p v-for="(value, index) in item.logData.split('\n')">{{ index + 1 + '. ' + value }}</p>
                    <template #footer>
                        <p class="text-end text-sm">{{ item.logTime }}</p>
                    </template>
                </ElCard>
            </div>
        </ElScrollbar>
    </div>
</template>

<script setup lang='ts' name=''>
import { getUpdateLog } from '@/api/function'
import { ref } from 'vue'
import { ElCard, ElScrollbar } from 'element-plus'
const updateLog = ref<any>([])

getUpdateLog().then((res) => {
    updateLog.value = res.data
})
</script>

<style scoped></style>